<template>
  <i-dialog v-bind="$attrs" :visible="visible" @close="close" @open="outerOpen">
    <!-- title -->
    <template slot="title">
      <slot name="outerTitle" />
    </template>
    <!-- body -->
    <slot />
    <!-- footer -->
    <template v-if="type === 'add'" slot="footer">
      <el-button size="small" type="primary" @click="submit" :loading="loading"
        >确定</el-button
      >
      <el-button size="small" @click="cancel">取消</el-button>
    </template>
    <template v-else slot="footer">
      <slot name="outerFooter" />
    </template>
  </i-dialog>
</template>
<script>
export default {
  name: 'CDialog',
  inheritAttrs: false,
  props: {
    type: {
      type: String,
      default: '',
    },
    visible: {
      type: Boolean,
      required: true,
    },
    loading: {
      type: Boolean,
      default: false,
    },
  },
  methods: {
    submit() {
      this.$emit('submit')
    },
    cancel() {
      this.$emit('cancel')
      this.$emit('update:visible', false)
    },
    close() {
      this.$emit('cancel')
      this.$emit('update:visible', false)
    },
    outerOpen() {
      this.$emit('outerOpen')
    },
  },
}
</script>
<style lang="scss" scoped></style>
